
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui">

<ui:define name="title">
	<h:outputText value="#{lang.NEW_COLLABORATOR}" />
</ui:define>

<body>
	<h:form prependId="false">
		<p:growl id="growl" showDetail="true" />	
		
		<h:outputText value="Recherche par Date :"></h:outputText>	
   		 <p:calendar value="#{procesesBean.date1}" id="popupCal" />  
   		 <p:calendar value="#{procesesBean.date2}" id="popupCal2" />  
   		 <br/>
       <br/>
        <br/>
		<p:barChart id="barChart" value="#{processesBean.processes}"
			legendPosition="ne" title="#{lang.BARTITLE} #{processesBean.collaboratorName}"
			style="height:500px;;width:800px" xaxisLabel="#{lang.PROCESS}" yaxisLabel="#{lang.MEMORY}" xaxisAngle="75">
			<p:ajax event="itemSelect" listener="#{processesBean.itemSelect}" 
							process="@this"
							  update="dialogID" oncomplete="dialog.show()">
			 </p:ajax>
							 
		</p:barChart>
		
		<p:dialog widgetVar="dialog" id ="dialogID" >			
			
		<p:lineChart id="category" value="#{processesBean.processesLine}"
			legendPosition="e" title="#{lang.LINETITLE} #{processesBean.processName}"
			minY="0" maxY="170000"
			style="height:400px; margin-top:20px;width:700px;"  xaxisAngle="75" xaxisLabel="#{lang.TIME}" yaxisLabel="#{lang.MEMORY}"/>
					
			
		</p:dialog>
		
		
		
		
		<p:dialog header="Selected Dates" widgetVar="dialogCalendar"   
            showEffect="fade" hideEffect="fade">  
      
        	<h:panelGrid id="display" columns="2" cellpadding="5">           
	         
	              
	            <h:outputText value="Popup Date:" />  
	            <h:outputText value="#{processesBean.date1}" id="popupDate">  
	                <f:convertDateTime pattern="d/M/yyyy"/>  
	            </h:outputText>  	              
	           
	              
        	</h:panelGrid>  
          
    </p:dialog>  
		
	</h:form>

</body>

</html>